<template>
    <!-- 安全验收计划 -->
    <base-breadcrumb>
        <searchData :searchData="searchOptions" @search="handleSearch" />

        <div class="page-body">
            <a-card :bordered="false">
                <!-- <title-name title="月安全交底计划" /> -->
                <div class="table-operateors mb20">
                    <a-button icon="plus" type="primary" @click="handleUpdate('add')" v-btnPermission="'hse_021_add_01'"
                        v-if="hideBuquBtn()">新增计划</a-button
                    >
                </div>
                <!-- 统计 -->
                 <!--   月安全交底计划总数：10 个 | 待提交审核：2 个 | 审核中：2 个 | 审核通过：2 个 | 审核不通过：2 个 -->
                <div class="pub-table-select-count">
                  <a-icon type="info-circle" theme="twoTone"/>
                  <span style="margin-right: 12px"> 月安全交底计划总数：
                    <span class="totalNum">{{totalDetails.total}}</span> 个  |
                    未提交 <span class="totalNum">{{totalDetails.draft}}</span> 个
                  </span>
                </div>
                <!-- 统计 -->
                <list-table
                    ref="table"
                    size="default"
                    rowKey="key"
                    :columns="columns"
                    :request="loadData"
                    :alert="true"
                    show-size-changer
                    show-quick-jumper
                    showPagination="auto"
                >
                    <span slot="sort" slot-scope="text, record, index">{{ index + 1 }}</span>
                    <template slot="operator" slot-scope="text, record">
                        <MoreButton>
                            <a class="base-btn" @click="handleUpdate('look', record)" v-btnPermission="'hse_021_loo_04'"
                                >查看</a
                            >
                            <a-divider
                                v-if="record.auditStatus === 'DRAFT'"
                                type="vertical"
                                v-btnPermission="'hse_021_loo_04'&&hideBuquBtn()"
                            />
                            
                            <a
                                v-if="record.auditStatus === 'DRAFT'&&hideBuquBtn()"
                                class="base-btn"
                                @click="handleUpdate('edit', record)"
                                v-btnPermission="'hse_021_edi_02'"
                                >编辑</a
                            >
                            <a-divider
                                v-if="record.auditStatus === 'DRAFT'&&hideBuquBtn()"
                                type="vertical"
                                v-btnPermission="'hse_021_edi_02'"
                            />
                            <a
                                v-if="record.auditStatus === 'DRAFT'&&hideBuquBtn()"
                                class="base-btn"
                                @click="handleUpdate('del', record)"
                                v-btnPermission="'hse_021_del_03'"
                                >删除</a
                            >
                        </MoreButton>
                    </template>

                    <span slot="auditStatus" slot-scope="text, record">
                        <list-status :status="record.auditStatus" conversion="en" :text="text"></list-status>
                    </span>
                </list-table>
            </a-card>
        </div>
    </base-breadcrumb>
</template>

<script>
import { STable } from '@/components'
import ThemeChoose from '@/components/themeChoose/themeChoose.vue'
import { getSafteyClosurePlanList, deleteSafteyClosurePlan, getSafteyClosurePlanCount } from '@/api/safetySupervision/safteyClosure'
import SelectSubCompany from '@/components/Select/SelectSubCompany' // 分公司
import SelectProject from '@/components/Select/SelectProject' // 项目
import OrgTreeSelect from '@/components/OrgTreeSelect'
import StatusDisplay from '@/components/StatusDisplay'
import Vue from 'vue'
import ExcelImportButton from '@/components/ExcelImportButton' // excel导入按钮
const searchOptions = [
  {
    name: '所属单位',
    valueKey: 'searchQuery',
    type: OrgTreeSelect,
  },
    // {
    //     name: '所属分公司',
    //     valueKey: 'branchComId',
    //     type: SelectSubCompany,
    // },
    // {
    //     name: '所属项目',
    //     keyValue: 'branchComId',
    //     valueKey: 'projectId',
    //     type: SelectProject,
    // },
    {
        name: '填报人',
        value: 'creatorName',
        type: 'input',
    },
    {
        name: '填报时间',
        value: 'createTime',
        type: 'dateRange',
    },
    {
        name: '状态',
        value: 'auditStatus',
        type: 'select',
        data: [
            {
                value: '0',
                label: '未提交',
            },
            {
                value: '1',
                label: '已提交',
            },
        ],
    },
]
const columns = [
    {
        title: '序号',
        dataIndex: 'sort',
        scopedSlots: { customRender: 'sort' },
        width: 60  
    },
    {
        title: '名称',
        dataIndex: 'name',
        width: 150  
    },
    {
        title: '所属分公司',
        dataIndex: 'branchComName',
        width: 150  
    },
    {
        title: '所属项目',
        dataIndex: 'projectName',
        width: 150 
    },

    {
        title: '填报人',
        dataIndex: 'creator',
        width: 100 
    },
    {
        title: '填报时间',
        dataIndex: 'createTime',
        width: 100 
    },
    {
        title: '状态',
        dataIndex: 'auditStatus',
        scopedSlots: { customRender: 'auditStatus' },
        width: 100 
    },
    {
        title: ' 操作',
        dataIndex: 'operator',
        scopedSlots: { customRender: 'operator' },
       width: 150  
    },
]
export default {
    name:'a'+Date.now(),    components: {
        ThemeChoose,
        STable,
        StatusDisplay,
        ExcelImportButton,
    },
    data() {
        this.searchOptions = searchOptions
        this.columns = columns
        return {
            queryParam: {},
            totalDetails: {
              total: 0,
              draft: 0,
              submitted: 0,
              past: 0,
              rejected: 0
            },
            loadData: async (parameter) => {
                const requestParameters = Object.assign({}, parameter, this.queryParam)
                this.getSafteyClosurePlanCount(this.queryParam)
                const [err, res] = await getSafteyClosurePlanList(requestParameters)
                return new Promise((resolve, reject) => {
                    if (err) {
                        reject(err)
                    } else {
                        resolve(res)
                    }
                })
            },
            importCheck: {
                规格: 'specification',
                试件编号: 'specimenNumber',
                '试验项目（种类）': 'experimentProjectName',
                部位: 'place',
                进场时间: 'entryTime',
                产地厂别: 'originSite',
                委托编号: 'principalNo',
                送检时间: 'inspectionTime',
                报告编号: 'reportNo',
                归档时间: 'archiveTime',
                是否见证: 'whetherToWitness',
                试验结果: 'experimentResultsName',
            },
        }
    },
    methods: {

        handleSearch(val = {}) {
            this.queryParam = {
                ...val,
                beginDate:
                    (val.createTime && val.createTime.length && val.createTime[0].format('YYYY-MM-DD')) || void 0,
                endDate: (val.createTime && val.createTime.length && val.createTime[1].format('YYYY-MM-DD')) || void 0,
            }
            this.$refs.table.refresh(true)
        },
        async deleteSafteyClosurePlan(data) {
            const [err, res] = await deleteSafteyClosurePlan({ id: data.id })
            if (!err) {
                this.$message.success('成功')
                this.$refs.table.refresh(true)
            }
        },
        // 处理更新操作（新增、编辑）
        async handleUpdate(type, data = {}) {
            console.log(type == 'del')
            if (type == 'del') {
                let that = this
                this.$confirm({
                    title: '温馨提示',
                    content: '确定是否删除数据？',
                    okText: '确认',
                    okType: 'danger',
                    cancelText: '取消',
                    onOk: () => {
                        return that.deleteSafteyClosurePlan(data)
                    },
                })
            } else {
                this.$router.push({
                    name: 'UpdateSafteyClosurePlan',
                    query: {
                        id: data.id || '',
                        pageType: type,
                    },
                })
            }
        },
        // 统计
        async getSafteyClosurePlanCount(param) {
          const [err, res] = await getSafteyClosurePlanCount(param);
          if (!err) {
            this.totalDetails = res.data;
          }
        }
    },
}
</script>

<style lang="less" scoped>
.page-header {
    .header-row {
        display: flex;
        .flex-content {
            flex: auto;
        }
        .divider {
            margin: 0 12px;
        }
        .expand-btn {
            margin-left: 8px;
            font-size: 14px;
        }
    }
}
.page-body {
    .table-operateors {
        .ant-btn + .ant-btn {
            margin-left: 12px;
        }
    }
}
</style>